body {
  background-color: #040C3A;
}

.first-container {
  height: 100%;
  width: 100%;
  padding: 10px !important;
  position: relative;
  background: url('@/assets/images/53bg.png') no-repeat;
  background-size: 100%;

  .header {
    padding: 0 10px !important;
    height: 10%;
    width: 100%;
    box-sizing: border-box;
  }

  .second-container {
    display: flex;
    flex-direction: row;
    width: 100%;
    height: 90%;
    margin: 0 !important;
    padding: 0 !important;
    box-sizing: border-box;
    overflow: hidden;


    .second-main {
      box-sizing: border-box;
      width: 28%;
      height: 100%;
      margin: 0 !important;
      padding: 0 !important;
      display: flex;
      flex-direction: column;

      .JC-wrapper {
        height: 55%;
        width: 100%;
        margin-bottom: 5%;
      }

      .data-wrapper {
        flex: 1;
      }
    }

    .sum-wrapper {
      flex: 1;
      margin: 0 !important;
      padding: 0 !important;
    }

    .dg-wrapper {
      box-sizing: border-box;
      width: 29%;
      height: 100%;
      margin: 0 !important;
      padding: 0 !important;
      display: flex;
      overflow: hidden;
      flex-direction: column;

      .JKJ-wrapper {
        height: 45%;
        width: 100%;
      }

      .TH-wrapper {
        height: 16%;
        width: 100%;
      }

      .chart-wrapper {
        margin-top: 10px;
        flex: 1;
      }
    }
  }
}


